export const recordListScript = `
  const vscode = acquireVsCodeApi();

  // 添加消息监听器处理 updateRecords
  window.addEventListener('message', event => {
    const message = event.data;
    log('收到消息: ' + JSON.stringify(message));
    
    switch (message.type) {
      case 'updateRecords':
        renderRecords(message.records);
        break;
    }
  });

  // HTML 转义函数
  function escapeHtml(text) {
    if (!text) return '';
    return text.replace(/&/g, '&amp;')
                .replace(/</g, '&lt;')
                .replace(/>/g, '&gt;')
                .replace(/"/g, '&quot;')
                .replace(/'/g, '&#39;');
  }

  // 生成标签HTML
  function generateTagsHtml(tags, recordId) {
    if (!tags || !Array.isArray(tags) || tags.length === 0) {
      return '';
    }
    
    const maxVisibleTags = 3;
    const visibleTags = tags.slice(0, maxVisibleTags);
    const hiddenCount = tags.length - maxVisibleTags;
    
    let tagsHtml = '<div class="record-tags">';
    
    // 显示可见标签
    visibleTags.forEach(tag => {
      tagsHtml += '<span class="tag-item" title="点击筛选: ' + escapeHtml(tag) + '" onclick="handleTagClick(event, \\'' + escapeHtml(tag) + '\\')">' + 
                 escapeHtml(tag) + '</span>';
    });
    
    // 如果有隐藏标签，显示省略号
    if (hiddenCount > 0) {
      const allTagsTitle = tags.map(tag => escapeHtml(tag)).join(', ');
      tagsHtml += '<span class="tag-more" title="全部标签: ' + allTagsTitle + '">+' + hiddenCount + '</span>';
    }
    
    tagsHtml += '</div>';
    return tagsHtml;
  }

  // 渲染记录列表
  function renderRecords(records) {
    log('渲染记录数量: ' + records.length);
    const recordsDiv = document.getElementById('records');
    
    if (!records || records.length === 0) {
      recordsDiv.innerHTML = '<div class="no-records">暂无记录</div>';
      return;
    }
    
    let html = '';
    records.forEach(record => {
      const tagsHtml = generateTagsHtml(record.tags, record.id);
      
      html += '<div class="record-item" onclick="handleClick(event, ' + record.id + ')">' +
        '<div class="record-content">' +
          '<div class="record-title">' + escapeHtml(record.problem) + '</div>' +
          '<div class="record-path">' + escapeHtml(record.filePath) + ':' + record.lineRange + '</div>' +
          tagsHtml +
          '<div class="record-solution">' + escapeHtml(record.solution.substring(0, 100)) + (record.solution.length > 100 ? '...' : '') + '</div>' +
        '</div>' +
        '<div class="button-group">' +
          '<button class="reference-btn cm-icon-reference iconfont" title="查看引用位置" onclick="openRecordReference(event, ' + record.id + ')"></button>' +
          '<button class="update-btn cm-icon-updateReference iconfont" title="更新引用位置" onclick="updateRecordReference(event, ' + record.id + ')"></button>' +
          '<button class="comment-btn cm-icon-mark iconfont" title="生成注释" onclick="generateComment(event, ' + record.id + ')"></button>' +
          '<button class="edit-btn cm-icon-edit iconfont" title="编辑" onclick="editRecord(event, ' + record.id + ')"></button>' +
          '<button class="delete-btn cm-icon-delete iconfont" title="删除" onclick="deleteRecord(event, ' + record.id + ')"></button>' +
        '</div>' +
      '</div>';
    });
    
    recordsDiv.innerHTML = html;
  }

  // 事件处理函数
  function handleClick(event, recordId) {
    if (event) event.stopPropagation();
    log('点击记录: ' + recordId);
    vscode.postMessage({ type: 'recordClick', recordId: recordId });
  }

  function openRecordReference(event, recordId) {
    if (event) event.stopPropagation();
    log('查看引用位置: ' + recordId);
    vscode.postMessage({ type: 'openRecordReference', recordId: recordId });
  }

  function generateComment(event, recordId) {
    event.stopPropagation();
    log('生成注释: ' + recordId);
    vscode.postMessage({ type: 'generateComment', recordId: recordId });
  }
  
  function editRecord(event, recordId) {
    event.stopPropagation();
    log('编辑记录: ' + recordId);
    vscode.postMessage({ type: 'editRecord', recordId: recordId });
  }
  
  function deleteRecord(event, recordId) {
    event.stopPropagation();
    log('删除记录: ' + recordId);
    vscode.postMessage({ type: 'deleteRecord', recordId: recordId });
  }

  function updateRecordReference(event, recordId) {
    event.stopPropagation();
    log('更新引用位置: ' + recordId);
    vscode.postMessage({ type: 'updateRecordReference', recordId: recordId });
  }

  function handleTagClick(event, tag) {
    event.stopPropagation();
    log('点击标签筛选: ' + tag);
    vscode.postMessage({ type: 'filterByTag', tag: tag });
  }
`
